<template>
	<view class="content-box">
		<view class="user-box">
			<image :src="$imageUrl(userDetail.avatar)" mode=""></image>
			<view class="">
				{{userDetail.nickName||''}}
			</view>
		</view>
		
		<view class="agreement-box">
			<view class="" @click="$routeTo('/pages/me/settingUp/agreementDetails/agreementDetails?type=4')">
				宠物运输契约条款
			</view>
			<view class=""  @click="$routeTo('/pages/me/changePassword/changePassword')">
				修改密码
			</view>
		</view>
		
	<!-- 	<view class="btn" @click="escLogin">
			退出登录
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userDetail:{}
			}
		},
		mounted() {
			this.$myRequest('/api/driver/mine/v1/driver/details').then(res => {
				this.userDetail = res.data
			})
		},
		methods: {
			escLogin(){
				uni.clearStorage();
				uni.reLaunch({
					url:'/pages/login/login'
				})
			}
		}
	}
</script>

<style lang="scss">
	.content-box{
		background-color: #f5f5f5;
		min-height: 100vh;
		.user-box{
				background-color: #ffffff;
				padding:20rpx 40rpx;
				display: flex;
				align-items: center;
				font-size: 32rpx;
				font-weight: bold;
				image{
					width: 120rpx;
					height: 120rpx;
					border-radius: 50%;
					margin-right: 20rpx;
				}
		}
		.agreement-box{
			background-color: #ffffff;
			margin-top: 20rpx;
			padding: 0 40rpx;
			view{
				padding: 30rpx 0;
				font-size: 28rpx;
				border-top: 2rpx solid #eaeaea;
			}
			view:nth-child(1){
				border: none;
			}
		}
	}
	
	.btn{
		width: 310rpx;
		height: 86rpx;
		background: rgba(255,146,49,1);
		border-radius: 44rpx;
		font-size: 28rpx;
		line-height: 86rpx;
		text-align: center;
		color: #FFFFFF;
		margin: 200rpx auto 0 auto;
	}
</style>
